<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<style>
.carousel {
  width: 300px;
}
.item {
  width: 300px;
  height: 200px;
  background-color: green;
  color: white;
}
.container {
  height: 2000px;
}
#test {
  width: 100px;
  height: 100px;
  border: 1px solid red;
  overflow-y: auto;
}
</style>
<body>
  <div id="app">
    <pb-carousel class="carousel">
      <pb-carousel-item v-for="item in 3" :key="item">
        <div class="item">{{ item }}</div>
      </pb-carousel-item>
    </pb-carousel>
    <div class="container">
      aaaa
      <div id="test">
        <div style="height: 500px; width: 100%;">bbbb</div>
      </div>
    </div>
    <pb-scrolltotop target="test">
      <div style="width:30px;height:30px;border-radius: 50%; background:#ffcccc; color: #fff">UP</div>
    </pb-scrolltotop>
  </div>
</body>
<script src="../node_modules/vue/dist/vue.js"></script>
<script src="../packages/scrolltotop/dist/umd/index.js"></script>
<script src="../packages/carousel/dist/umd/index.js"></script>
<script src="../packages/carousel-item/dist/umd/index.js"></script>
<script>
  const vue = new Vue({
    el: '#app'
  })
</script>
</html>